<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>PHP表单编辑页面（静态资源输出）</title>
</head>

<body>
  <h3 class="title"> PHP 静态资源输出 <span id="time"></span></h3>
  <!-- 输出脚本文件staticOutput.php -->
  <form class="submit_form" method="post" action="staticOutput.php">
    <p>
      标题：<input type="text" name="news_title" id="">
    </p>
    <p>
      内容：<textarea name="news_contents" cols="50" rows="10"></textarea>
    </p>
    <p class="submit_btn">
      <button type="submit">发布</button>
    </p>
  </form>
  <style>
    .title {
      height: 40px;
      line-height: 40px;
      text-align: center;
    }

    .submit_form {
      clear: both;
      width: 500px;
      margin: 0 auto;
    }

    .submit_form p {
      line-height: 24px;
      font-size: 14px;
    }

    input[type="text"] {
      width: 392px;
      height: 25px;
      line-height: 25px;
      padding-left: 5px;
    }

    textarea {
      vertical-align: middle;
      padding: 5px;
      width: 388px;
    }

    .submit_btn {
      text-align: center;
    }

    button[type="submit"] {
      width: 340px;
      background-color: #f84f4f;
      color: #fff;
      border: none;
      padding: 5px 15px;
      margin: 0 auto;
      margin-right: 6px;
      cursor: pointer;
    }

    button[type="submit"]:hover {
      background-color: red;
    }

    #time {
      margin-left: 10px;
      font-size: 12px;
      color: red;
    }
  </style>
  <script>
    function getTimes() {
      const date = new Date();
      // 月
      let month = date.getMonth() + 1;
      // 天
      let days = date.getDay();
      switch (days) {
        case 1:
          days = "星期一";
          break;
        case 2:
          days = "星期二";
          break;
        case 3:
          days = "星期三";
          break;
        case 4:
          days = "星期四";
          break;
        case 5:
          days = "星期五";
          break;
        case 6:
          days = "星期六";
          break;
        case 0:
          days = "星期日";
          break;
      }

      let strDate = date.getDate();

      if (month >= 1 && month <= 9) {
        month = "0" + month;
      }
      if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
      }
      // 年月日
      let currentDate =
        date.getFullYear() +
        "年" +
        month +
        "月" +
        strDate +
        "日" +
        "      " +
        days;

      let th = date.getHours();
      let tm = date.getMinutes();
      let ts = date.getSeconds();
      if (th < 10) th = "0" + th;
      if (tm < 10) tm = "0" + tm;
      if (ts < 10) ts = "0" + ts;

      // 时分秒
      let currentTime = th + ":" + tm + ":" + ts;

      document.getElementById("time").innerHTML = currentDate + ' ' + currentTime
    }

    getTimes();

    setInterval(() => {
      getTimes();
    }, 1000)
  </script>
</body>

</html>